﻿<%@ Page Title="" Language="C#" MasterPageFile="~/SIPO.master" AutoEventWireup="false"
    CodeFile="recReconlist.aspx.cs" Inherits="SIPO.Web.Lists.Transaction.recReconlist" %>

<asp:Content ID="Content1" ContentPlaceHolderID="body" runat="Server">
    <link type="text/css" rel="stylesheet" href="<%= ResolveUrl("~/styles/ui.jqgrid.css") %>" />
    <script type="text/javascript" src="<%= ResolveUrl("~/scripts/i18n/grid.locale-id.js") %>"></script>
    <script type="text/javascript" src="<%= ResolveUrl("~/scripts/jquery.jqGrid.min.js") %>"></script>
    <script src="<%= ResolveUrl("~/scripts/helper.js") %>" type="text/javascript"></script>
    <div>
        <table>
            <tr>
                <td style="width: 50">
                    Periode Harian
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:RadioButton ID="rbPeriode1" runat="server" GroupName="rbPeriode" Checked=true /><asp:TextBox
                        ID="txtPeriodeAwal" runat="server" Width="100"></asp:TextBox>
                    s/d
                    <asp:TextBox ID="txtPeriodeAkhir" runat="server" Width="100"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td style="width: 50">
                    Periode Bulanan
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:RadioButton ID="rbPeriode2" runat="server" GroupName="rbPeriode" />&nbsp;<asp:DropDownList
                        ID="cbBulan" runat="server">
                        <asp:ListItem Value="1">Januari</asp:ListItem>
                        <asp:ListItem Value="2">Februari</asp:ListItem>
                        <asp:ListItem Value="3">Maret</asp:ListItem>
                        <asp:ListItem Value="4">April</asp:ListItem>
                        <asp:ListItem Value="5">Mei</asp:ListItem>
                        <asp:ListItem Value="6">Juni</asp:ListItem>
                        <asp:ListItem Value="7">Juli</asp:ListItem>
                        <asp:ListItem Value="8">Agustus</asp:ListItem>
                        <asp:ListItem Value="11">September</asp:ListItem>
                        <asp:ListItem Value="10">Oktober</asp:ListItem>
                        <asp:ListItem Value="11">November</asp:ListItem>
                        <asp:ListItem Value="12">Desember</asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
        </table>
        <button id="btnCari" type="button" >
            Cari</button>
    </div>
    <br />
    <br />
    <table id="table" class="scroll" cellpadding="0" cellspacing="0">
    </table>
    <div id="pager" class="scroll">
    </div>
    <div id="dialog" title="Default dialog">
    </div>
    <script type="text/javascript">
        $("#btnCari").button({ icons: { primary: "ui-icon-pencil"} });
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#<%= cbBulan.ClientID %>").attr('disabled', 'disabled');
            //default radio button semua



            // format tanggal dengan datepicker
            $("#<%= txtPeriodeAwal.ClientID  %>").datepicker({ showWeek: true, showButtonPanel: true,
                changeMonth: true, changeYear: true, dateFormat: 'dd/mm/yy',
                numberOfMonths: 1,
                onSelect: function (selected) {
                    $("#<%= txtPeriodeAkhir.ClientID %>").datepicker("option", "minDate", selected)
                }
            });

            $("#<%= txtPeriodeAkhir.ClientID  %>").datepicker({ showWeek: true, showButtonPanel: true,
                changeMonth: true, changeYear: true, dateFormat: 'dd/mm/yy',
                numberOfMonths: 1,
                onSelect: function (selected) {
                    $("#<%= txtPeriodeAwal.ClientID %>").datepicker("option", "maxDate", selected)
                }
            });


            //radio button periode awal dan periode akhir
            $("#<%= rbPeriode1.ClientID %>").click(function () {
                $("#<%= txtPeriodeAwal.ClientID %>").removeAttr('disabled');
                $("#<%= txtPeriodeAkhir.ClientID %>").removeAttr('disabled');
                $("#<%= txtPeriodeAwal.ClientID %>").val('');
                $("#<%= txtPeriodeAkhir.ClientID %>").val('');
                $("#<%= cbBulan.ClientID %>").val('');
                $("#<%= cbBulan.ClientID %>").attr('disabled', 'disabled');

            });

            $("#<%= rbPeriode2.ClientID %>").click(function () {
                $("#<%= cbBulan.ClientID %>").removeAttr('disabled');
                $("#<%= txtPeriodeAwal.ClientID %>").val('');
                $("#<%= txtPeriodeAkhir.ClientID %>").val('');
                $("#<%= txtPeriodeAwal.ClientID %>").attr('disabled', 'disabled');
                $("#<%= txtPeriodeAkhir.ClientID %>").attr('disabled', 'disabled');
            });


            $("#btnCari").click(function () {
                var periodeAwal = "";
                var periodeAkhir = "";
                var bulan = "";
                var pilih = "";

                if ($("#<%= txtPeriodeAwal.ClientID %>").is(':disabled'))
                    periodeAwal = "";
                else
                    periodeAwal = $("#<%= txtPeriodeAwal.ClientID %>").val();

                if ($("#<%= txtPeriodeAkhir.ClientID %>").is(':disabled'))
                    periodeAkhir = "";
                else
                    periodeAkhir = $("#<%= txtPeriodeAkhir.ClientID %>").val();

                if ($("#<%= cbBulan.ClientID %>").is(':disabled'))
                    bulan = "";
                else
                    bulan = $("#<%= cbBulan.ClientID %>").val();

                if (bulan == "") {
                    pilih = 1; // tanggal
                }
                else {
                    pilih = 2; // bulan
                }

                //alert(bulan + "-" + periodeAwal + "-" + periodeAkhir);



                ok = true;
                //   alert(ok);
                //   alert(tgl);
                var periodeawal = periodeAwal;
                var periodeakhir = periodeAkhir;
                jQuery("#table").setGridParam({ url: '<%= ResolveUrl("~/AjaxHandler/Transaction/recReconhandler.ashx") %>' + "?method=getdatareal&periodeAwal=" + periodeAwal + "&periodeAkhir=" + periodeAkhir + "&bulan=" + bulan + "&pilih=" + pilih });
                        jQuery("#table").trigger("reloadGrid", [{ page: 1}]);





//                $.ajax({
//                    type: 'POST',
//                    url: handlerUrl + "?method=getdata&periodeAwal=" + periodeAwal + "&periodeAkhir=" + periodeAkhir + "&bulan=" + bulan + "&pilih=" + pilih,
//                    contentType: 'application/json',
//                    dataType: 'json',
//                    data: jsonData,
//                    success: function (data) {
//                        if (data.IsSuccess) {

//                        }
//                        else {
//                            //alert(data.Message);
//                        }
//                    },
//                    error: function (response) {
//                        var r = JSON.parse(response.responseText);
//                        alert("Error Message: " + r.Message);
//                    }
//                });

            });
        });


        var handlerUrl = '<%= ResolveUrl("~/AjaxHandler/Transaction/recReconhandler.ashx") %>';
        $('#table').jqGrid({
            url: handlerUrl + '?method=getdatareal',
            datatype: 'json',
            colNames: ['ID Transaksi', 'Debitur', 'Keterangan', 'Jumlah (Rp)', 'Payment Date', 'ID Transaksi Bank', 'Keterangan', 'Jumlah (Rp)', 'Tanggal Pembayaran','TransID', 'Aksi'],
            colModel: [

                    { name: 'Pungutan_IDTransaksi', index: 'Pungutan_IDTransaksi',align :'center', width: 100, hidden: false, searchoptions: { searchhidden: false} },
                    { name: 'Pungutan_Debitur', index: 'Pungutan_Debitur', width: 100 },
                    { name: 'Pungutan_Keterangan', index: 'Pungutan_Keterangan', width: 200 },
                    { name: 'Pungutan_Jumlah', index: 'Pungutan_Jumlah', width: 85, formatter: 'number', align: 'right' },
                    { name: 'Pungutan_PaymentDate', index: 'Pungutan_PaymentDate', width: 300, hidden: true, searchoptions: { searchhidden: true} },

                    { name: 'TransID', index: 'TransID', align: 'center', width: 100, hidden: false, searchoptions: { searchhidden: false} },
                    { name: 'Data_Bank_Keterangan', index: 'Data_Bank_Keterangan', width: 200 },
                    { name: 'Data_Bank_Jumlah', index: 'Data_Bank_Jumlah', width: 85, formatter: 'number', align: 'right'},
                    { name: 'Data_Bank_TransDate', index: 'Data_Bank_TransDate', width: 300, hidden: true, searchoptions: { searchhidden: true} },
                    { index: 'TransID', name: 'TransID', hidden : true, width:0},
                    //{ name: 'Status', index: 'Status', width: 100 }
                    { index: 'Status', name: 'Status', align: 'center', formatter: linkDetail, width: 75, searchoptions: { searchhidden: true} }

           	],
            rowNum: 10,
            id: 'Pungutan_IDTransaksi',
          
            rowList: [5, 10, 15, 20],
            pager: '#pager',
            sortname: 'aa.mutationValue',
            sortorder: "desc",
            viewrecords: true,
            jsonReader: { repeatitems: false },
            width: 1250,
            height: '100%',
            caption: 'Rekonsiliasi',
            ajaxGridOptions: { cache: false }
            
        });

            jQuery("#table").jqGrid('setGroupHeaders', {
                useColSpanStyle: false,
                groupHeaders: [
	    { startColumnName: 'Pungutan_IDTransaksi', numberOfColumns: 4, titleText: 'Data Pungutan' },
	    { startColumnName: 'TransID', numberOfColumns: 6, titleText: 'Data Bank' }
        //{ startColumnName: 'Status', numberOfColumns: 1, titleText: 'Aksi' }
        
        ]
            });

        $("#table").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false, search : false, searchtext: 'Search', refreshtext: 'Refresh' },
        {}, {}, {}, { closeOnEscape: true, multipleSearch: true, closeAfterSearch: true });

       // var invoice;
        function linkDetail(cellValue, options, rowdata) {
            var RestID = encodeURIComponent(cellValue);
            var id = rowdata['TransID'];
            var invoice = rowdata['Pungutan_IDTransaksi'];
           // alert(invoice);
            return "<a href=\"" + "#" + "\"" + " onclick=\"" + "popupform('" + RestID + "','" + id + "','" + invoice + "')" + "\"" + ">" + RestID + "</a>";
        }

        function popupform(ctl,InvoiceCode, invoice) {
            //alert(ctl);
            var formPenyesuaian = '<%= ResolveUrl("~/forms/transaction/recReconAdjusform.aspx") %>';
            var formUpdate = '<%= ResolveUrl("~/forms/transaction/recReconPaymentform.aspx") %>';
            var grid = $('#table');
            var selIds = grid.jqGrid('getGridParam', 'selarrrow'),
                selText = [];
            $.each(selIds, function () {
                selText.push(grid.jqGrid('getCell', this, 'Pungutan_IDTransaksi'));
            });
         //   alert(selText);


            if (ctl == 'Penyesuaian') {
                $('#dialog').load(formPenyesuaian + '?menuId=' + '<%= base.MenuID %>' + '&Invoice=' + InvoiceCode).dialog({ autoOpen: false, modal: true, width: 600, title: 'Input Penyesuaian Dana' });
                $("#dialog").dialog('open');
            }
            else if (ctl == 'UpdatePayment') {
                $('#dialog').load(formUpdate + '?menuId=' + '<%= base.MenuID %>' + '&Invoice=' + invoice).dialog({ autoOpen: false, modal: true, width: 600, title: 'Update Payment' });
                $("#dialog").dialog('open');
            }
            else {

//                if (selIds.length == 0)
//                    alert('Pilih data yang mau di hapus !');
//                else {
//                    var result = window.confirm('Benar data akan di hapus ?');
//                    if (result) {

//                        var objrecPayment = new Object();
//                        objrecPayment.PaymentID = encodeURIComponent(selText);
//                        jsonData = JSON.stringify(objrecPayment);
//                        CallAjax('<%= ResolveUrl("~/ajaxhandler/transaction/recPaymenthandler.ashx") %>', "?method=delete", jsonData);
//                        setTimeout("$('#table').trigger('reloadGrid');", 3000);
//                    }
//                }

            }
        }
        
    </script>
</asp:Content>
